<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="referrer" content="no-referrer"/>
	<meta name="isLogin" th:content="${isLogin}">
	<link rel="stylesheet" type="text/css" href="/css/logo.css">
	<link rel="stylesheet" type="text/css" href="/css/cardCreator.css">
	<link rel="stylesheet" type="text/css" href="/css/search.css">
	<link rel="stylesheet" type="text/css" href="/css/jquery.page.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	<link rel="stylesheet" type="text/css" href="http://demo.htmleaf.com/1901/201901251459/src/css/dialog.css">
	<link rel="stylesheet" type="text/css" href="/css/index_phone.css">

	<link rel="stylesheet" type="text/css" th:if="${config.css != null && config.css.trim() != ''}" th:href="${config.css}">
	<title>搜索</title>
</head>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script src="http://demo.htmleaf.com/1901/201901251459/src/jquery.dialog.js"></script>
<script src="/js/jquery.page.js"></script>
<script src="/js/Util.js"></script>
<script src="/js/suggestBox.js"></script>
<script src="/js/common.js"></script>
<script src="/js/CardCreator.js"></script>
<script src="/js/scriptLoader.js"></script>
<body class="phone">
	<div class="background"></div>
	<div style="position: fixed;left: 0;right: 0;top: 0;z-index: 2;">
		<div class="time">
			<span>13</span><span>:</span><span>07</span>
		</div>
		<div class="searchBox">
			<form class="searchContentBox" action="/search">
				<select name="platform" class="platformSelect">
					<option th:each="search:${searchList}" th:value="${search.val}" th:text="${search.text}"></option>
				</select>
				<span class="searchBar">
					<input name="key" id="search" type="text" class="search" autocomplete="off"/>
				</span>
				<span class="searchBtnBox" style="width: auto;">
					<button id="searchBtn" class="searchBtn">
						<i class="fa fa-search"></i>
					</button>
				</span>
			</form>
		</div>
		<div class="suggestBox" id="suggestBox">
			<!--<div class="suggestItem" index="0" key="迪迦奥特曼">迪迦奥特曼</div>
            <div class="suggestItem" index="1" key="泰罗奥特曼">泰罗奥特曼</div>
            <div class="suggestItem" index="2" key="欧布奥特曼" >欧布奥特曼</div>
            <div class="suggestItem" index="3">泽塔奥特曼</div>
            <div class="suggestItem" index="4">盖亚奥特曼</div>-->
		</div>
	</div>
	<div class="loginBtn" >
		<a th:href="${isLogin?'/user/history':'/login'}" th:text="${isLogin?'「查看播放记录」':'「点击此处登录」'}"></a>
	</div>

	<div class="footer">
		<div id="verse">
			[( ${config.verse} )]
		</div>
		<div id="announce">
			<p>本站内容均从互联网收集而来，仅供交流学习使用，版权归原创者所有</p>
			<p >如有侵犯了您的权益，尽请通知我们，本站将及时删除侵权内容。</p>
		</div>
	</div>
</body>
<script type="text/javascript">
	$(".contentBox").height(window.innerHeight - 30 - $(".searchBox").height() - 3);
	$(".content").css("min-height", $(".contentBox").height() - $(".footer").height() - 90 - 3);
	$(".contentBox").css("top", ($(".searchBox").height() + 30) + "px");

	var tipsBox = {};
	var searcher = {};

	SuggestBox({
		rootDom: $("#suggestBox"),
		activeClass: "activeSuggestItem",
		onChange: function(old ,newDom){
			searcher.text($(newDom).text());
		},
		onSelected: function(selected){
			searcher.search($(selected).text());
		}
	}, tipsBox);

	// 初始化推荐框
	SuggestBox.suggest("", function(list){
		var suggestBox = document.getElementById("suggestBox");
		suggestBox.innerHTML = "";
		for(var i = 0, l = list.length; i < l; i ++){
			var item = list[i];
			var li = util.createTag("div", "suggestItem");
			li.setAttribute("key", item);
			li.innerHTML = item;
			suggestBox.appendChild(li);
		}
	})

	Search({
		dom: $("#search"),
		focus: () => tipsBox.show(),
		blur: () => tipsBox.hide(),
		input: (e) => SuggestBox.suggest($(e.target).val()),
		submit: (text) => {
			if (text === ''){
				location.reload();
			}
			tipsBox.hide();
			$("#searchBtn").click();
			// query(text)
		}
	}, searcher);
/*	$("#searchBtn").click(function(){
		if ($("#search").text() === '') {
			location.reload();
		}
		searcher.search();
	});*/

	// 初始化时间
	updateTime();
	function updateTime() {
		var date = new Date();
		var h = date.getHours();
		var m = date.getMinutes();
		$(".time span:first").text(h<10?"0"+h:h);
		$(".time span:last").text(m<10?"0"+m:m);
	}
	var timeInterval = setInterval(updateTime, 1000);

</script>
<script type="text/javascript" th:if="${config.js != null && config.js.trim() != ''}" th:src="${config.js}"></script>
</html>